.dapp-deal-page::-webkit-scrollbar {
  display: none;
}
.dapp-deal-page {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
  overflow-y: auto;
  .header-tab {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 44px;
    width: 248px;
    background: #08080b;
    box-sizing: border-box;
    border: 2px solid #303236;
    margin-top: 25px;
    border-radius: 50px;
    padding: 1px 1.5px 0.5px 1.5px;
    .active-tab {
      width: 122px;
      height: 36px;
      line-height: 36px;
      background: #303236;
      border-radius: 50px;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      font-size: 14px;
      color: #ffe5a4;
      font-weight: 600;
      cursor: pointer;
      .tab-icon {
        margin-right: 10px;
        img {
          width: 12px;
          height: auto;
        }
      }
    }
    .tab-item {
      width: 122px;
      height: 36px;
      line-height: 36px;
      background: #191b1f;
      border-radius: 50px;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      font-weight: 400;
      font-size: 14;
      color: rgba(255, 255, 255, 0.498);
      cursor: pointer;
      .tab-icon {
        margin-right: 10px;
        img {
          width: 12px;
          height: auto;
        }
      }
    }
  }
  .page-container {
    margin-top: 16px;
    height: 500px;

    .body-content {
      width: 530px;
      border-radius: 11px;
      overflow: hidden;
      .header {
        background-color: #303236;
        padding: 0px 15px;

        .header-nav-box {
          height: 60px;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          align-items: center;
          font-size: 13px;
          color: #ffe5a4;
          border-bottom: 1px solid rgba(255, 255, 255, 0.098);

          .header-left {
            cursor: pointer;
            height: 17px;
            line-height: 17px;
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: center;
            .right-arrow-icon {
              margin-left: 8px;
              height: 11px;
            }
          }
          .header-right {
            height: 17px;
            line-height: 17px;

            cursor: pointer;
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
            align-items: center;
            .clock-icon {
              margin-right: 4px;
              width: 11px;
            }
          }

          &:hover {
            color: rgb(219, 197, 137);
          }
        }
        .trading-record-header-nav-box {
          height: 60px;
          display: flex;
          flex-direction: row;
          justify-content: flex-start;
          align-items: center;
          font-size: 13px;
          color: #ffe5a4;
          .back-icon {
            width: 20px;
            height: 20px;
            margin-right: 10px;
            cursor: pointer;
            position: relative;
            top: 2px;
          }
          .active {
            font-family: Microsoft YaHei UI;
            font-size: 14px;
            font-weight: normal;
            letter-spacing: 0px;
            color: #ffd7a1;
            margin-right: 30px;
            cursor: pointer;
          }
          .normal {
            font-family: Microsoft YaHei UI;
            font-size: 14px;
            font-weight: normal;
            letter-spacing: 0px;
            color: rgba(255, 255, 255, 0.498);
            margin-right: 30px;
            cursor: pointer;
          }
        }
      }
    }
  }
}
.deal-box-comp {
  width: 100%;
  .deal-trans-box {
    background-color: #303236;
    border-radius: 0px 0px 11px 11px;

    .middle-box {
      height: 31px;
      margin: 0px 16px;
      .ant-divider-inner-text {
        padding: 0px;
      }
      .ant-divider {
        margin: 0px;
        &::before {
          border-style: dashed;
          border-color: rgba(255, 255, 255, 0.102);
        }
        &::after {
          border-style: dashed;
          border-color: rgba(255, 255, 255, 0.102);
        }
      }
      .middle-title {
        width: 31px;
        height: 31px;
        background: #45474a;
        border-radius: 100px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
      }
    }
    .bottom-box {
      height: 95px;
    }
    .box-control {
      padding: 13px 16px;
      .box-title {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 10px;
        .title-text {
          font-size: 14px;
          color: rgba(255, 255, 255, 0.298);
          display: flex;
          .recevied-model-change {
            height: 24px;
            padding: 0px 8px;
            border-radius: 100px;
            background: #303236;
            box-sizing: border-box;
            border: 1px solid rgba(255, 255, 255, 0.1);
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            white-space: nowrap;
            margin-left: 9px;
            .change-text {
              font-size: 12px;
              font-weight: normal;
              letter-spacing: 0px;
              color: rgba(255, 255, 255, 0.5);
              
            }
            .change-icon {
              width: 9px;
            margin-left: 4px;
            }
          }
        }

        .title-right {
          display: flex;
          flex-direction: row;
          justify-content: flex-end;
          align-items: center;
          .right-value {
            font-size: 14px;
            letter-spacing: 0px;
            color: rgba(255, 255, 255, 0.498);
          }
          .right-max {
            font-size: 14px;
            color: #ccb883;
            margin-left: 9px;
            cursor: pointer;
          }
        }
      }
      .box-info {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        .value-input {
          width: 370px;
          height: 44px;
          line-height: 44px;
          font-family: Microsoft YaHei UI;
          font-size: 24px;
          background-color: transparent;
          border: 0px;
          &:focus-within {
            outline: none;
            box-shadow: none;
          }
          .ant-input-number-input {
            color: @hover-text-color;
            font-weight: 600;
            padding-left: 0px;

            &::-webkit-input-placeholder {
              color: rgba(255, 255, 255, 0.2);
              font-weight: 600;
            }
          }
          .ant-input-number-handler-wrap {
            display: none;
          }
        }
        .coin-info {
          display: flex;
          flex-direction: row;
          justify-content: flex-end;
          align-items: center;
          .coin-icon {
            width: 24px;
            height: 24px;
            margin-right: 10px;
            img {
              width: 100%;
              height: 100%;
            }
          }
          .coin-name {
            font-size: 20px;
            font-weight: normal;
            color: #ffffff;
          }
        }
      }
      .fast-box {
        margin-top: 24px;
        .percent-row {
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          align-items: center;
          margin-bottom: 13px;
          .normal {
            width: 80px;
            height: 28px;
            line-height: 28px;
            border-radius: 5px;
            background: transparent;
            border: 1px solid rgba(255, 255, 255, 0.2);
            font-size: 13px;
            font-weight: normal;
            color: #ffffff;
            text-align: center;
          }
          .active {
            width: 80px;
            height: 28px;
            line-height: 28px;
            border-radius: 5px;
            background: transparent;
            border: 1px solid #ccb883;
            font-size: 13px;
            font-weight: normal;
            color: #ccb883;
            text-align: center;
          }
          .slider-normal {
            width: 108px;
            height: 28px;
            line-height: 28px;
            border-radius: 5px;
            background: transparent;
            border: 1px solid rgba(255, 255, 255, 0.2);
            font-size: 13px;
            font-weight: normal;
            color: #ffffff;
            text-align: center;
            position: relative;
            padding-right: 30px;
            .unit {
              position: absolute;
              right: 10px;
              height: 28px;
              line-height: 28px;
            }
          }
          .slider-active {
            width: 108px;
            height: 28px;
            line-height: 28px;
            border-radius: 5px;
            background: transparent;
            border: 1px solid rgba(255, 255, 255, 0.2);
            font-size: 13px;
            font-weight: normal;
            color: #ccb883;
            text-align: center;
            position: relative;
            padding-right: 30px;
            border: 1px solid #ccb883;
            .unit {
              position: absolute;
              right: 10px;
              height: 28px;
              line-height: 28px;
            }
          }
        }
        .slider-row {
          .ant-slider-rail {
            height: 10px;
            background: #3d3f44;
          }
          .ant-slider-track {
            height: 10px;
            background-color: #ffe5a4;
          }
          .ant-slider-handle {
            &::before {
              width: 22px;
              height: 22px;
            }
            &::after {
              top: -2px;
              width: 22px;
              height: 22px;
              box-shadow: none;
              background-color: #ffe5a4;
            }
          }
        }
      }
    }
  }
  .add-address {
    height: 41px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 0px 12px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.498);
    cursor: pointer;
    .prev-icon {
      width: 12px;
      height: auto;
      margin-right: 5px;
    }
  }
  .adding-address {
    height: 41px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 0px 12px;
    font-size: 13px;
    color: #f5757d;
    cursor: pointer;
    .prev-icon {
      width: 12px;
      height: auto;
      margin-right: 5px;
    }
  }
  .address-save-box {
    border-radius: 11px;
    opacity: 1;
    background: #303236;
    padding: 0px 16px 16px 16px;
    .title-row {
      height: 36px;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      font-family: Microsoft YaHei UI;
      font-size: 12px;
      font-weight: normal;
      color: rgba(255, 255, 255, 0.498);
    }
    .address-input {
      height: 32px;
      border-radius: 5px;
      opacity: 1;
      background: #191b1f;
      border: 0px;
      caret-color: @hover-text-color;
    }
  }
  .current-price-box {
    margin-top: 12px;
    border-radius: 11px;
    background: #303236;
    padding: 16px;
    padding-bottom: 28px;

    .current-price-row {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      padding-bottom: 12px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.098);
      margin-bottom: 19px;
      .label-text {
        font-family: Microsoft YaHei UI;
        font-size: 12px;
        font-weight: normal;
        letter-spacing: 0px;
        color: rgba(255, 255, 255, 0.498);
        display: flex;
        .tip-icon {
          width: 12px;
          height: auto;
          margin-right: 7px;
        }
      }
      .value-text {
        font-family: Microsoft YaHei UI;
        font-size: 12px;
        font-weight: normal;
        line-height: 15.24px;
        text-align: right;
        color: #ffffff;
      }
    }
    .other-fee-row {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      &:not(:last-child) {
        margin-bottom: 16px;
      }
      .label-text {
        font-family: Microsoft YaHei UI;
        font-size: 12px;
        font-weight: normal;
        color: rgba(255, 255, 255, 0.498);
        display: flex;
        .tip-icon {
          width: 12px;
          height: auto;
          margin-right: 7px;
        }
      }
      .value-text {
        font-family: Microsoft YaHei UI;
        font-size: 12px;
        font-weight: normal;
        text-align: right;
        color: #ffffff;
      }
    }
  }
  .action-btn-box {
    margin-top: 12px;
    margin-bottom: 40px;
    .action-btn {
      width: 100%;
      height: 44px;
      line-height: 44px;
      padding: 0px;
      border: 0px;
      border-radius: 100px;
      background: linear-gradient(90deg, #ffe5a4 0%, #ff6a8d 100%);
      font-family: Microsoft YaHei UI;
      font-size: 16px;
      font-weight: normal;
      text-align: center;
      color: #38373c;
      &:hover {
        background: linear-gradient(90deg, #ff6a8d 0%, #ffe5a4 100%);
      }
    }
  }
}

.deal-records-comp {
  .records-box {
    padding: 16px 12px;
    background: #303236;
    .records-data {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      .list-box {
        height: 400px;
        width: 100%;

        .record-item {
          border-radius: 7px;
          background: #3d3f44;
          padding: 0px 12px 10px 12px;
          margin-bottom: 8px;
          .item-title {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            padding: 11px 0px 5px 0px;
            .title-left {
              display: flex;
              flex-direction: row;
              justify-content: flex-start;
              align-items: center;
              .type-text {
                font-family: Microsoft YaHei UI;
                font-size: 12px;
                font-weight: normal;
                color: #ffffff;
                margin-right: 12px;
              }
              .time-text {
                font-family: Microsoft YaHei UI;
                font-size: 12px;
                font-weight: normal;
                color: rgba(255, 255, 255, 0.502);
              }
            }
            .title-right {
              display: flex;
              flex-direction: row;
              justify-content: flex-end;
              align-items: center;
              .percent-text {
                font-family: Microsoft YaHei UI;
                font-size: 12px;
                font-weight: normal;
                color: #dbc589;
              }
              .status-text {
                font-family: Microsoft YaHei UI;
                font-size: 12px;
                font-weight: normal;
                color: #ff9900;
                margin-left: 29px;
              }
            }
          }
          .value-box {
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: center;
            padding: 16px 8px;
            border-radius: 5px;
            background: #303236;
            .pre-icon {
              width: 18px;
              height: 18px;
              margin-right: 11px;
            }
            .row-data {
              width: calc(100% - 30px);
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: flex-start;
              .row-item {
                display: flex;
                flex-direction: row;
                justify-content: flex-start;
                align-items: center;
                &:not(:last-child) {
                  margin-bottom: 5px;
                }
                .item-label {
                  font-family: Microsoft YaHei UI;
                  font-size: 12px;
                  font-weight: normal;
                  color: #ffffff;
                  margin-right: 10px;
                }
                .item-value {
                  font-family: Microsoft YaHei UI;
                  font-size: 12px;
                  font-weight: normal;
                  color: #ffffff;
                  margin-right: 10px;
                }
              }
            }
          }
          .code-box {
            margin-top: 7px;
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: center;
            .pre-icon {
              width: 12px;
              height: 12px;
              margin-right: 7px;
            }
            .code-text {
              font-family: oriicon;
              font-size: 12px;
              font-weight: normal;
              line-height: 15.24px;
              color: rgba(255, 255, 255, 0.502);
            }
          }
        }
      }
      .pagination-box {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        .ant-pagination-item a {
          color: rgba(255, 255, 255, 0.5);
        }
        .ant-pagination-item-link {
          color: rgba(255, 255, 255, 0.5);
        }
        .ant-pagination-item-active {
          background-color: #3d3f44;
          border: 0px;
          a {
            color: #ffe5a4;
          }
        }
      }
    }
  }
  .connect-wallete-box {
    height: 439px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-top: 71px;
    background-color: #303236;
    .icon-img {
      width: 100px;
      height: 85px;
    }
    .connect-btn {
      width: 104px;
      height: 34px;
      line-height: 34px;
      padding: 0px;
      opacity: 1;
      background: linear-gradient(90deg, #ffe5a4 0%, #ff628b 100%);
      border: 0px;
      padding: 0px;
      margin-top: 26px;
      border-radius: 50px;
    }
    .tip-text {
      /* 请连接钱包以查看资产、申购、赎回、质押等信息。 */

      width: 259px;
      line-height: 24px;
      font-family: Microsoft YaHei UI;
      font-size: 14px;
      font-weight: normal;
      line-height: 20px;
      align-items: center;
      letter-spacing: 0px;
      color: rgba(255, 255, 255, 0.8);
      text-align: center;
      margin-top: 30px;
    }
  }
}

.buy-detail-records-modal {
  .ant-modal-content {
    padding: 0px;
    background: #303236;
  }
}
.buy-detail-records-comp {
  box-sizing: border-box;
  width: 100%;
  height: 610px;
  .title-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 38px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0px 16px;
    box-sizing: border-box;
    .title-text {
      font-size: 12px;
      color: #fff;
    }
    .close-icon {
      cursor: pointer;
    }
  }
  .header-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0px;
    margin: 0px 15px;

    .left {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      .left-item {
        display: flex;
        font-size: 13px;
        margin-right: 20px;
        .item-label {
          color: rgba(255, 255, 255, 0.5);
        }
        .item-value {
          color: rgba(255, 255, 255, 1);
        }
      }
    }
    .right {
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: center;
      .right-item {
        display: flex;
        font-size: 13px;
        margin-right: 20px;
        .item-label {
          color: rgba(255, 255, 255, 1);
        }
      }
    }
  }
  .body-content {
    height: 441px;
    background-color: #000;
    border-radius: 11px;
    margin: 0px 15px;
    box-sizing: border-box;
    .content-header {
      height: 41px;
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      padding: 0px 7.5px;
      .header-title {
        width: 126px;
        height: 24px;
        line-height: 24px;
        border-radius: 5px;
        opacity: 1;
        background: #10cb81;
        font-size: 13px;
        font-weight: normal;
        color: #ffffff;
        margin-right: 12px;
        padding: 0px 6px;
      }
      .tips-icon {
        width: 14px;
        height: 15px;
      }
    }
    .scroll-box {
      height: 400px;
      overflow-y: auto;
      &::-webkit-scrollbar {
        display: none;
      }
      .ant-table {
        background-color: transparent;
        border: 0px;
        border-radius: 0px;
        .ant-table-container {
          border-inline-start: 0px;
          border-top: 0px;
          border-start-start-radius: 0px;
          border-start-end-radius: 0px;
        }
        .ant-table-thead {
          .ant-table-cell {
            background-color: transparent;
            color: rgba(255, 255, 255, 0.498);
            font-size: 14px;
            background-color: transparent;
            border-inline-end: 0px;
            &:first-child {
              border-start-start-radius: 0px;
            }
            &:last-child {
              border-start-end-radius: 0px;
            }
          }

          tr {
            th {
              border-bottom: 0px;
              &:not(:last-child):not(.ant-table-selection-column):not(
                  .ant-table-row-expand-icon-cell
                ):not([colspan])::before {
                background-color: transparent;
              }
            }
          }
        }
        .ant-table-tbody {
          .ant-table-placeholder {
            background-color: transparent;
            .ant-empty {
              .ant-empty-description {
                color: #fff;
              }
            }
          }
          .ant-table-cell {
            background-color: transparent;
            color: rgba(255, 255, 255, 0.8);
            font-size: 14px;
            border-bottom: 0px;
            border-inline-end: 0px;
            padding-top: 4px;
            padding-bottom: 8px;
            .token-text {
              color: #ccb883;
            }
            .action-text {
              color: #ccb883;
              cursor: pointer;
            }
            .contract-address {
              display: flex;
              flex-direction: row;
              justify-content: flex-end;
              align-items: center;
              .copy-icon {
                color: #fff;
                margin-left: 5px;
                cursor: pointer;
              }

              .copy-icon-hover {
                display: none;
                color: #fff;
                margin-left: 5px;
                cursor: pointer;
              }
              .copy-success-icon {
                width: 9px;
                margin-left: 5px;
              }
              &:hover {
                color: @hover-text-color;

                .copy-icon-hover {
                  display: block;
                  cursor: pointer;
                }
                .copy-icon {
                  display: none;
                  cursor: pointer;
                }
              }
            }
          }

          .dark-cell {
            .ant-table-cell {
              color: rgba(244, 240, 240, 0.298) !important;
              .token-text {
                color: rgba(244, 240, 240, 0.298) !important;
              }
            }
          }
        }
      }
    }
  }
  .tips-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    margin: 10px 15px;
    color: rgba(255, 255, 255, 0.5);
  }
  .footer-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 0px 15px;
    .left {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      .buy-btn {
        width: 117px;
        height: 36px;
        line-height: 36px;
        cursor: pointer;
        border-radius: 5px;
        background: linear-gradient(90deg, #ffe5a4 0%, #ccb883 100%);
        text-align: center;
        font-size: 14px;
        color: rgba(0, 0, 0, 0.8);
        position: relative;
        margin-right: 16px;
        &:hover {
          background: linear-gradient(90deg, #ccb883 0%, #ffe5a4 100%);
        }
        .buy-loading-icon {
          width: 22px;
          height: 22px;
          position: absolute;
          left: 11px;
          top: 7px;
        }
      }
      .buy-status-box {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        .status-icon {
          width: 13px;
          height: 13px;
        }
        .text {
          font-size: 12px;
          color: rgba(255, 255, 255, 0.5);
          margin-left: 5px;
        }
        .num {
          font-size: 12px;
          color: #ff9900;
          margin-left: 5px;
        }
      }
    }
    .right {
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: center;
      color: rgba(255, 255, 255, 0.5);
      cursor: pointer;
      .right-text {
        margin-right: 5px;
      }
      .light-arrow {
        display: none;
      }
      .right-arrow {
        display: block;
        position: relative;
        top: 1px;
      }
      &:hover {
        color: @hover-text-color;
        .light-arrow {
          display: block;
          position: relative;
          top: 1px;
        }
        .right-arrow {
          display: none;
        }
      }
    }
  }
}

.sell-detail-records-modal {
  .ant-modal-content {
    padding: 0px;
    background: #303236;
  }
}

.sell-detail-records-comp {
  box-sizing: border-box;
  width: 100%;
  height: 700px;
  .title-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 38px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0px 16px;
    box-sizing: border-box;
    .title-text {
      font-size: 12px;
      color: #fff;
    }
    .close-icon {
      cursor: pointer;
    }
  }
  .header-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0px;
    margin: 0px 15px;

    .left {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      border: 2px solid #ffd7a1;
      padding: 4px 3px;
      border-radius: 100px;
      &:not(:last-child) {
        margin-right: 4px;
      }
      .type-tab-item {
        width: 212px;
        height: 36px;
        line-height: 36px;
        border-radius: 100px;
        opacity: 1;
        background: linear-gradient(
          90deg,
          rgba(255, 255, 255, 0.03) 0%,
          rgba(241, 245, 249, 0.03) 95%
        );
        font-size: 14px;
        font-weight: normal;
        text-align: center;
        color: rgba(255, 255, 255, 0.5);
        text-align: center;
        cursor: pointer;
      }
      .type-tab-item-active {
        width: 212px;
        height: 36px;
        line-height: 36px;
        border-radius: 100px;
        opacity: 1;
        background: #ffd7a1;
        font-size: 14px;
        font-weight: normal;
        text-align: center;
        color: #38373c;
        text-align: center;
        cursor: pointer;
      }
    }
    .right {
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: center;
      .right-item {
        display: flex;
        font-size: 13px;
        margin-right: 20px;
        .item-label {
          color: rgba(255, 255, 255, 1);
        }
      }
    }
  }

  .desc-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 10px;
    padding: 0px 16px;
    .left-item {
      display: flex;
      font-size: 13px;
      margin-right: 20px;
      .item-label {
        color: rgba(255, 255, 255, 0.5);
      }
      .item-value {
        color: rgba(255, 255, 255, 1);
      }
    }
  }
  .body-content {
    height: 441px;
    background-color: #000;
    border-radius: 11px;
    margin: 0px 15px;
    box-sizing: border-box;
    .content-header {
      height: 41px;
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      padding: 0px 7.5px;
      .header-title {
        height: 24px;
        line-height: 24px;
        border-radius: 5px;
        opacity: 1;
        background: #10cb81;
        font-size: 13px;
        font-weight: normal;
        color: #ffffff;
        margin-right: 12px;
        padding: 0px 6px;
      }
      .tips-icon {
        width: 14px;
        height: 15px;
      }
    }
    .scroll-box {
      height: 400px;
      overflow-y: auto;
      &::-webkit-scrollbar {
        display: none;
      }
      .ant-table {
        background-color: transparent;
        border: 0px;
        border-radius: 0px;
        .ant-table-container {
          border-inline-start: 0px;
          border-top: 0px;
          border-start-start-radius: 0px;
          border-start-end-radius: 0px;
        }
        .ant-table-thead {
          .ant-table-cell {
            background-color: transparent;
            color: rgba(255, 255, 255, 0.498);
            font-size: 14px;
            background-color: transparent;
            border-inline-end: 0px;
            &:first-child {
              border-start-start-radius: 0px;
            }
            &:last-child {
              border-start-end-radius: 0px;
            }
          }

          tr {
            th {
              border-bottom: 0px;
              &:not(:last-child):not(.ant-table-selection-column):not(
                  .ant-table-row-expand-icon-cell
                ):not([colspan])::before {
                background-color: transparent;
              }
            }
          }
        }
        .ant-table-tbody {
          .ant-table-placeholder {
            background-color: transparent;
            .ant-empty {
              .ant-empty-description {
                color: #fff;
              }
            }
          }
          .ant-table-cell {
            background-color: transparent;
            color: rgba(255, 255, 255, 0.8);
            font-size: 14px;
            border-bottom: 0px;
            border-inline-end: 0px;
            padding-top: 4px;
            padding-bottom: 8px;
            .token-text {
              color: #ccb883;
            }
            .action-text {
              color: #ccb883;
              cursor: pointer;
            }
            .contract-address {
              display: flex;
              flex-direction: row;
              justify-content: flex-end;
              align-items: center;
              .copy-icon {
                color: #fff;
                margin-left: 5px;
                cursor: pointer;
              }

              .copy-icon-hover {
                display: none;
                color: #fff;
                margin-left: 5px;
                cursor: pointer;
              }
              .copy-success-icon {
                width: 9px;
                margin-left: 5px;
              }
              &:hover {
                color: @hover-text-color;

                .copy-icon-hover {
                  display: block;
                  cursor: pointer;
                }
                .copy-icon {
                  display: none;
                  cursor: pointer;
                }
              }
            }
          }

          .dark-cell {
            .ant-table-cell {
              color: rgba(244, 240, 240, 0.298) !important;
              .token-text {
                color: rgba(244, 240, 240, 0.298) !important;
              }
            }
          }
        }
      }
    }
  }
  .tips-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    margin: 10px 15px;
    color: rgba(255, 255, 255, 0.5);
  }
  .footer-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 0px 15px;
    .left {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      .buy-btn {
        width: 117px;
        height: 36px;
        line-height: 36px;
        cursor: pointer;
        border-radius: 5px;
        background: linear-gradient(90deg, #ffe5a4 0%, #ccb883 100%);
        text-align: center;
        font-size: 14px;
        color: rgba(0, 0, 0, 0.8);
        position: relative;
        margin-right: 16px;
        &:hover {
          background: linear-gradient(90deg, #ccb883 0%, #ffe5a4 100%);
        }
        .buy-loading-icon {
          width: 22px;
          height: 22px;
          position: absolute;
          left: 11px;
          top: 7px;
        }
      }
      .buy-status-box {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        .status-icon {
          width: 13px;
          height: 13px;
        }
        .text {
          font-size: 12px;
          color: rgba(255, 255, 255, 0.5);
          margin-left: 5px;
        }
        .num {
          font-size: 12px;
          color: #ff9900;
          margin-left: 5px;
        }
      }
    }
    .right {
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: center;
      color: rgba(255, 255, 255, 0.5);
      cursor: pointer;
      .right-text {
        margin-right: 5px;
      }
      .light-arrow {
        display: none;
      }
      .right-arrow {
        display: block;
        position: relative;
        top: 1px;
      }
      &:hover {
        color: @hover-text-color;
        .light-arrow {
          display: block;
          position: relative;
          top: 1px;
        }
        .right-arrow {
          display: none;
        }
      }
    }
  }
}
// .top-notice {
//   width: 100%;
//   height: 24px;
//   line-height: 24px;
//   background: #A7FFDC;
//   display: flex;
//   flex-direction: row;
//   justify-content: center;
//   align-items: center;
//   border-radius: 11px;
//   margin-bottom: 10px;
// }
